<style lang="scss" scoped>
</style>

<template>
  <div>
    <van-nav-bar title="我的档案" left-text="返回" left-arrow @click-left="gotoback" />
    <div
      style="height: 100vh; display: flex; justify-content: space-around; flex-direction: column"
    >
      <div
        style="
          height: calc(100vh - 46px);
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: space-around;
        "
        v-if="!flag"
      >
        <img src="@/images/bg/null.png" alt="" />
        <p style="text-align: center; margin-top: 10px; font-size: 14px; color: #999">
          您还没有档案哦
        </p>
        <el-button
          type="primary"
          style="width: 80%; margin-top: 50px"
          size="large"
          @click="addfiles"
          >添加</el-button
        >
      </div>
      <div v-else="flag">
        <div class="edit">
          <div class="edit-item">
            <p>[主要症状]</p>
            <van-field v-model="diseaseMain" placeholder="请输入主要症状" />
          </div>
          <div class="edit-item">
            <p>[现病史]</p>
            <van-field v-model="diseaseNow" placeholder="请输入现病史" />
          </div>
          <div class="edit-item">
            <p>[既往病史]</p>
            <van-field v-model="diseaseBefore" placeholder="请输入既往病史" />
          </div>
          <div class="edit-item">
            <p>[治疗经历]</p>
            <van-field v-model="treatmentHospitalRecent" placeholder="请输入治疗经历" />
          </div>
        </div>
        <div class="edit-item" style="border: 0">
          <!-- <p>[相关图片]</p> -->
          <img :src="dataImg" alt="" />
        </div>
        <div style="width: 100%; text-align: center; margin-top: 20px">
          <el-button @click="delefile" type="danger">删除档案</el-button>
          <el-button @click="bianfile" type="primary">编辑档案</el-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { ElMessage } from 'element-plus'
import { deleteUserArchives, findUserArchives } from '../../../src/api/search'
import { onMounted, ref } from 'vue'
import { useRouter } from 'vue-router'

const diseaseMain = ref('')
const diseaseBefore = ref('')
const diseaseNow = ref('')
const gotoback = () => {
  router.push('/my')
}
const treatmentHospitalRecent = ref('')
const dataImg = localStorage.getItem('dataSrc') || ''
const userId = ref(parseInt(localStorage.getItem('userId') as string))
const sessionId = ref(JSON.parse(localStorage.getItem('sessionId') as string))
const flag = ref(true)
onMounted(async () => {
  const res = await findUserArchives(userId.value, sessionId.value)
  console.log(res.data)
  console.log(res.data.result[0])
  console.log(res.data.result.length)

  if (res.data.result.length == '1') {
    flag.value = true
  } else {
    flag.value = false
  }
  console.log(flag.value)
  diseaseMain.value = res.data.result[0].diseaseMain
  diseaseNow.value = res.data.result[0].diseaseNow
  diseaseBefore.value = res.data.result[0].diseaseBefore
  diseaseNow.value = res.data.result[0].diseaseNow
  treatmentHospitalRecent.value = res.data.result[0].treatmentHospitalRecent
  localStorage.setItem('archivesId', res.data.result[0].archivesId)
})
const addfiles = () => {
  router.push('/add')
}
const delefile = async () => {
  const res = await deleteUserArchives(
    userId.value,
    sessionId.value,
    parseInt(localStorage.getItem('archivesId') as string)
  )
  diseaseMain.value = ''
  diseaseNow.value = ''
  diseaseBefore.value = ''
  diseaseNow.value = ''
  flag.value = false
  ElMessage.success('档案删除成功')
  console.log(res)
}
const bianfile = async () => {
  parseInt(localStorage.getItem('archivesId') as string)
  router.push('/edit')
}
// 路由
const router = useRouter()
</script>
<style lang="scss" scoped>
.edit {
  padding: 20px;
  .edit-item {
    padding: 10px 0;
    border-bottom: 0.0625rem solid #ccc;
    p {
      color: #007bff;
      line-height: 50px;
      margin-left: 10px;
    }
  }
}
</style>
